
<template>
  <div class="contain">
    <MySearch @openDialog="openDialog" @parentseachfun="parentseachfun"/>
    <MyBody :arr="arr" @resettale="getLocalHost" @openDialod="parenDialod" />
    <MyPage
      @pagechange="pagechange"
      @pageSizechange="pageSizechange"
      :page="page"
      :pageSize="pageSize"
      :total="total"
    />
    <!-- tankuang -->
    <MyDialog
      :dialogtype="dialogtype"
      v-if="show"
      :dialogrow="dialogrow"
      @closeDialog="closeDialog"
      @addTable="addTable"
    />
  </div>


</template>

<script>

import MySearch from "./component/MySearch";
import MyBody from "./component/MyBody";
import MyPage from "./component/MyPage.vue";
import MyDialog from "./component/MyDialog.vue";
import { getNaData } from "@/api/na";
export default {
  // props:['arr'],
  components: {
    MySearch,
    MyBody,
    MyPage,
    MyDialog,
  },
  data() {
    return {
      arr: [],
      show: false,
      dialogrow: {},
      dialogtype: 0,
      page: 1,
      pageSize: 20,
      search: "",
      total: 0,
    };
  },
  mounted() {
    this.getLocalHost();
  },
  methods: {
    pagechange(val) {
      this.page = val;
      this.getLocalHost();
    },

    pageSizechange(val) {
      this.pageSize = val;
      this.getLocalHost();
    },

    parentseachfun(val) {
      this.search = val;
      this.getLocalHost();
    },
    parenDialod(row) {
      this.dialogrow = row;
      this.dialogtype = 1;
      this.show = true;
    },
    addTable() {
      this.show = false;
      this.getLocalHost();
    },
    getLocalHost() {
      var params = {
        search: this.search,
        page: this.page,
        pageSize: this.pageSize,
      };
      getNaData(params).then((res) => {
        console.log(res);
        if (res.code == 200) {
          this.arr = res.data;
          this.total = res.total;
        }
      });
    },
    closeDialog() {
      this.show = false;
    },

    openDialog() {
      this.dialogrow = {};
      this.dialogtype = 0;

      this.show = true;
    },
  },
};
</script>

<style>
.contain {
  background-color: #fff;
  border-radius: 10px;
  height: 100%;
}
</style>